<template>
	<div class="table-container">
		<el-table class="table-list" ref="multipleTable" :data="tableData" tooltip-effect="dark" style="width: 100%" @selection-change="handleSelectionChange">
			<el-table-column type="selection" width="55"> </el-table-column>
			<el-table-column prop="name" label="姓名" width="120"></el-table-column>
			<el-table-column label="籍贯" width="150">
				<template slot-scope="scope">{{ scope.row.location }}</template>
			</el-table-column>
			<el-table-column label="投资时间" width="120">
				<template slot-scope="scope">{{ scope.row.date }}</template>
			</el-table-column>
			<el-table-column label="收支类型" width="120">
				<template slot-scope="scope">{{ typeObj[scope.row.type] }}</template>
			</el-table-column>
			<el-table-column label="收入" width="120">
				<template slot-scope="scope"
					><span class="success">{{ `+${scope.row.income}` }}</span></template
				>
			</el-table-column>
			<el-table-column prop="expend" width="120" label="支出">
				<template slot-scope="scope"
					><span class="danger">{{ `-${scope.row.expend}` }}</span></template
				>
			</el-table-column>
			<el-table-column width="120" label="账户现金">
				<template slot-scope="scope"
					><span class="main">{{ scope.row.money }}</span></template
				>
			</el-table-column>
			<el-table-column label="操作">
				<template slot-scope="scope">
					<el-button type="warning" @click="updateHomeData(scope.row)">编辑</el-button>
					<el-button type="danger" @click="deleteHomeData(scope.row.id)">删除</el-button>
				</template>
			</el-table-column>
		</el-table>
	</div>
</template>

<script>
import homeAPI from "../../../api/home";
export default {
	data() {
		return {
			tableData: [],
			typeObj: {
				0: "充值",
				1: "优惠券",
				2: "理财服务退出",
				3: "购买宜定盈",
			},
			multipleSelection: [],
		};
	},

	methods: {
		handleSelectionChange(val) {
			this.multipleSelection = val;
		},
		getHomeData(paramsObj = {}) {
			homeAPI.getHomeData(paramsObj).then((res) => {
				if (res.code == 200) {
					this.tableData = res.data;
				}
			});
		},
		deleteHomeData(idArray) {
			let idList = [].concat(idArray);
			homeAPI
				.deleteHomeData({
					idList,
				})
				.then((res) => {
					if (res.code == 200) {
						this.getHomeData();
					}
				});
		},
		deleteBatchData() {
			if (this.multipleSelection.length > 0) {
				let idArray = this.multipleSelection.map((el) => el.id);
				this.deleteHomeData(idArray);
			}
		},
		updateHomeData(row) {
			let dialog = this.$parent.$refs.dialog;
			dialog.form = JSON.parse(JSON.stringify(row));
			dialog.btnType = 1;
			dialog.dialogVisible = true;
		},
		search(keyWord) {
			this.getHomeData({ keyWord });
		},
	},
	mounted() {
		this.getHomeData();
		this.$bus.$on("deletebatchData", this.deleteBatchData);
		this.$bus.$on("search", this.search);
	},
	beforeDeatroy() {
		this.$bus.$off("deletebatchData");
		this.$bus.$off("search");
	},
};
</script>

<style lang="less" scoped>
.table-container {
	overflow: auto;
	flex: 1;
	.success {
		color: #67c23a !important;
	}
	.danger {
		color: #f56c6c;
	}
	.main {
		color: #409eff;
	}
}
</style>
